<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">

	<meta content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;” name=”viewport” />
	<!-- 强制让文档的宽度与设备的宽度保持1:1，并且文档最大的宽度比例是1.0，且不允许用户点击屏幕放大浏览； -->

	<meta content=”yes” name=”apple-mobile-web-app-capable” /> 
	<!-- iphone私有标签：允许全屏模式浏览； -->

	<meta content=”black” name=”apple-mobile-web-app-status-bar-style” /> 
	<!-- iphone私有标签，指定safari顶端的状态条的样式 -->

	<meta content=”telephone=no” name=”format-detection” /> 
	<!-- 忽略将页面中的数字识别为电话号码 -->

	<title>Document</title>


</head>
<body>
	<select name="pro" id="pro" onchange="bian();">
		<option value="">城市</option>
		<option value="1">汕头</option>
		<option value="2">潮州</option>
		<option value="3">揭阳</option>
	</select>
	<select name="xian" id="xian"></select>
</body>
<script>
	function bian(){
		var map = ['',['市区','澄海','南澳','潮阳'],['潮州','饶平'],['市区','普宁']];
		var pro = document.getElementById('pro');
		var xian = document.getElementById('xian');
		var city = map[pro.value];
		for(var i=0,len=city.length,str='';i<len;i++)
		{
			str = str + '<option>' + city[i] + '</option>';
		}
		xian.innerHTML=str;

}



	</script>
</html>